<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <LINK href="resourses/style.css" rel="stylesheet" type="text/css">
   <title>Merry Mariachi</title>
   <style>
      body {
         background-image:url('pictures/chipsAndSalsa.jpg');
		 background-repeat:no-repeat;
      }
   </style>
</head>

<!-- ------------------------------------------------------------------- -->
<script>
function help(){
	alert("A waiter is on the way to help you.");
	/////send a note to the waiters that this tablet needs help
}

function refill(){
	//refill screen popup
	window.open('refillScreen.html','refillWindow','resizable=no, titlebar=no, menubar=no, width=430, height=360, toobar=no');	
}
</script>
<!-- ------------------------------------------------------------------- -->

<body>
<!-- Back Button and Title -->
   	<div id="backButton">
	<a href="foodMenu.html">
      	<button class="backButton">Back</button>
   	</a></div>

<!-- Item Details -->
	<!-- Food Name, Picture, and Description -->
   	<div id="menuItem">
      	<h1>Item Name</h1>
      	<img src="pictures/fajita.jpg"><br/>
	Item Description
	<br/><br/>

	<!-- Options For This Menu Item -->
	<input type="checkbox" id="optionalIngredient1" />Optional Ingredient<br />
	<input type="checkbox" id="optionalIngredient2" />Optional Ingredient<br />
	<input type="checkbox" id="optionalIngredient3" />Optional Ingredient<br />
	<input type="checkbox" id="optionalIngredient4" />Optional Ingredient<br />
	<input type="checkbox" id="optionalIngredient5" />Optional Ingredient<br /><br/>

	<!-- Text box for additional requests -->
	Additional Requests:
	<form>
        <input type="text" id="comment" maxlength="140" size="140" value="Type any additional requests here. (140 characters or less!)"/>
      	</form><br/><br/><br/><br/><br/>
   	</div>

<!-- Help and Refill buttons at the bottom. -->
	<div id="pageBottom">
	<button class="footerButton" onclick="help()">Help</button>
	<button class="footerButton" onclick="refill()">Refill</button>
	</div>
</body>
</html>
</html>